<template>
    <div class="operation">
        <form class="operation-search-form" @submit.prevent="refreshUserData">
            <el-input placeholder="请输入姓名" suffix-icon="el-icon-search" v-model="search_user_name" @blur="refreshUserData">
            </el-input>
            <button type="submit" hidden></button>
        </form>
        <div class="operation-row">
            <div class="operation-block" @click="refreshUserData">
                <i class="el-icon-refresh"></i>
                <span>刷新</span>
            </div>
            <div class="operation-block" @click="add">
                <i class="el-icon-circle-plus"></i>
                <span>新增</span>
            </div>
            <div class="operation-block" @click="delUser">
                <i class="el-icon-delete"></i>
                <span>删除</span>
            </div>
        </div>

        <department-add></department-add>
    </div>
</template>

<script>
import DepartmentAdd from "./add";
import department from "@/api/department.js";

export default {
    name: "department-operation",
    data() {
        return {
            search_user_name: undefined
        };
    },
    components: {
        DepartmentAdd
    },
    methods: {
        refreshUserData() {
            this.$store.dispatch("department1/getDepartmentUserList", {
                id: undefined,
                name: this.search_user_name
            });
            this.$store.dispatch('department1/getDepartmentRightDetails')
            this.search_user_name = undefined;
        },
        add() {
            this.$store.dispatch("department1/getNoInDepartmentUserList", {});
            this.$store.commit(
                "department1/CHANGE_IS_ADD_USER_DIALOG_SHOW",
                true
            );
        },
        delUser() {
            let data = this.$store.state.department1.wait_del_department_user_list;
            if(data == undefined || data.length == 0) {
                this.$message({
                    type:'info',
                    message: '请选择删除人员!'
                });
                return;
            }
            this.$confirm("确认删除？", "提示", {
                confirmButtonText: "确认",
                cancelButtonText: "取消",
                type: "warning"
            })
                .then(() => {
                    department
                        .delDepartmentUser({
                            params: {
                                ids: data
                            }
                        })
                        .then(res => {
                            this.$message({
                                type: "success",
                                message: "删除成功!"
                            });
                            this.refreshUserData();
                        })
                        .catch(err => {
                            this.$message({
                                type: "warning",
                                message: "哪里出现了问题~~"
                            });
                        });
                })
                .catch(() => {
                    this.$message({
                        type: "info",
                        message: "已取消删除"
                    });
                }).finally(() => {
                    data = null;
                });
        }
    }
};
</script>

<style>

</style>
